<template>
  <div class="app-container">
    <el-dialog
      title="重新转派"
      :visible.sync="dialogTableVisible"
      :close-on-click-modal="false"
      :before-close="close"
      width="900px">
      <el-form :model="selectForm" ref="queryForm" :inline="true">
        <el-form-item label="姓名：">
          <el-input v-model="selectForm.nickName" placeholder="请输入维修员名称" clearable size="small"/>
        </el-form-item>
        <el-form-item label="资质证书：">
          <el-select v-model="selectForm.aptitudeId" placeholder="请选择" clearable size="small">
            <el-option
              v-for="item in [{value: '1',label: '未检验'},{value: '2',label: '合格'},{value: '3',label: '不合格合格'}]"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" icon="el-icon-search" @click="getList();">搜索</el-button>
        </el-form-item>
      </el-form>
      <el-table v-loading="loading" :data="list" stripe border highlight-current-row @selection-change="currentChange" height="400" ref="multipleTable">
        <el-table-column type="selection" width="55"/>
        <el-table-column align="center" type="index" label="序号" width="55"/>
        <el-table-column align="center" label="姓名" prop="nickName"/>
        <el-table-column align="center" label="性别">
          <template slot-scope="scope">
            <template v-if="scope.row.sex==0">男</template>
            <template v-if="scope.row.sex==1">女</template>
          </template>
        </el-table-column>
        <el-table-column align="center" label="资质证书" prop="aptitudes"></el-table-column>
        <el-table-column align="center" label="未完成工单数" prop="size"/>
      </el-table>

      <!-- <el-table v-loading="loading" :data="list" stripe border highlight-current-row @selection-change="currentChange" height="150">
        <el-table-column type="selection" width="55"/>
        <el-table-column align="center" type="index" label="序号" width="55"/>
        <el-table-column align="center" label="姓名" prop="nickName"/>
        <el-table-column align="center" label="性别">
          <template slot-scope="scope">
            <template v-if="scope.row.sex==0">男</template>
            <template v-if="scope.row.sex==1">女</template>
          </template>
        </el-table-column>
        <el-table-column align="center" label="资质证书" prop="aptitudes"></el-table-column>
        <el-table-column align="center" label="未完成工单数" prop="size"/>
      </el-table> -->
      <!-- <pagination
        :total="total"
        :page.sync="selectForm.pageNum"
        :limit.sync="selectForm.pageSize"
        @pagination="getList"
        :page-sizes="[5,10,30, 50]"
      /> -->
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" type="primary" @click="sumbit">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {reportForRepair} from '@/api/repair/index'
import {implementer} from '@/api/curing/index'
  export default {
    name: "addDialog.vue",
    props:['info'],
    data() {
      return {
        loading: false,//加载
        dialogTableVisible: true,
        selectForm: {
          nickName: null,
          aptitudeId: null,
          responsibilityId:'device003-03'
          // pageNum: 1,
          // pageSize: 5
        },//查询条件
        list: [],//数据
        total: 0,
        selectDate: '',//时间,
        selectData: [],//选中数据
        userList:[]
      }
    },
    watch: {
      dialogTableVisible: function () {
        //this.dialogTableVisible = true;//始终让他为true;
      },
    },
    created(){
      // this.userList=[1,54]
      this.selectForm.repairId=this.info.id
      this.getList()
    },
    methods: {
      getList() {
        
        reportForRepair(this.info.id).then((res)=>{
          if(res.code==200){
            this.list=res.data.notDeviceImplementerReportForRepairList
            res.data.deviceImplementerReportForRepairs.forEach((item,index)=>{
              this.userList.push(item.userId)
              if(index==(res.data.deviceImplementerReportForRepairs.length-1)){
                setTimeout(()=>{
                  this.getInitData()
                },300)
              }
            })
            
          }
        })
      },
      getInitData(){
        this.list.forEach((item,index) => {
          this.userList.forEach((i)=>{
            if(i==item.userId){
              console.log(i,this.selectData,this.list[index])
              // list.splice(index,1)
              this.selectData.push(this.list[index])
              this.$refs.multipleTable.toggleRowSelection(this.list[index],true)
            }
            
          })
          // if(index==(this.list.length-1)){
            
          //   this.selectData.forEach(row => {
          //     console.log(row)
          //     this.$refs.multipleTable.toggleRowSelection(this.list[2])
          //   });
          // }
        });

      },
      currentChange(val) {
        this.selectData = val
      },
      close(){
        this.$emit('selectChange')
      },
      sumbit(){
        if(this.selectData.length<=0){
          this.$message.error('请选择转派人员')
          return
        }
        let array=[]
        for(let i=0;i<this.selectData.length;i++){
          array.push({conductorId:this.selectData[i].userId,conductorName:this.selectData[i].nickName})
        }
        this.$emit('chooseInfo',array)
      }
    }
  }
</script>

<style scoped>
  .bule {
    color: #2196F3;
    cursor: pointer
  }
</style>
